<!DOCTYPE html>
<html>
<head>
<base href="<?php echo XXF_HTTP?>" />
<meta charset="utf-8">
<title>抽奖</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
var arr=
['','三等奖','三等奖','三等奖','三等奖','三等奖','三等奖','三等奖','三等奖','三等奖','三等奖'
,'三等奖','三等奖','三等奖','三等奖','三等奖','三等奖','三等奖','三等奖','三等奖','三等奖'
,'二等奖','二等奖','二等奖','二等奖','二等奖','二等奖','二等奖','二等奖','二等奖','二等奖'
,'一等奖','一等奖','一等奖','一等奖','一等奖'];
(function(window){
	var Jxxf=function(selector,content){
		if(typeof selector=='function'){
			window.onload=selector;
		}else{
			return new Jxxf.fn.init(selector,content);
		}
	}
	Jxxf.fn={
		init:function(selector,content){
			if(~selector.indexOf('#')){
				this[0]=document.getElementById(selector.slice(1));
				return this;
			}
		}
	}
	Jxxf.td=function(obj,deg,fn){
		reg=/([0-9]+)/;
		var i=0;
		var z=function(){
			wt=obj.style.webkitTransform;
			//console.log("rotateY("+(parseInt(reg.exec(wt||0)[0])+1)+"deg)");
			obj.style.webkitTransform="rotateY("+(parseInt(reg.exec(wt||0)[0])+1)+"deg)";
			i++;
			if(typeof fn=='function'){
				fn(i);
			}
			if(deg==i){
				clearInterval(t);
			}
		}
		var t=setInterval(z,10);
	}
	window.Jxxf=Jxxf;
})(window);
Jxxf(function(){
	<?php
	$result=xdb::getInstance()->getarray("select * from tempcj order by rand()");
	$i=0;
	foreach ($result as $row){?>
    document.getElementById("d<?php echo $row['id']?>").style.webkitTransform="rotateY(180deg)";
    document.getElementById("d<?php echo $row['id']?>").style.color="red";
	<?php 
	if($row['status']=='0'){
	?>
		document.getElementById("d<?php echo $row['id']?>").style.webkitTransform="rotateY(360deg)";
		document.getElementById("d<?php echo $row['id']?>").innerHTML=document.getElementById("d<?php echo $row['id']?>").innerHTML+"<br><?php echo $row['result']?><br>"+arr[<?php echo $row['result']?>];
		document.getElementById("d<?php echo $row['id']?>").style.backgroundColor="#fff";
		document.getElementById("d<?php echo $row['id']?>").style.border="5px solid #000";
	<?php
	}
	}?>
	//以上初始化数据
	
});
var fan=function (ele){
	if(ele.style.webkitTransform=="rotateY(180deg)"){
		Jxxf.td(ele,180,function(i){
			if(i==90){
				//document.getElementById(ele.id).style.color="red";
				document.getElementById(ele.id).style.backgroundColor="#fff";
				document.getElementById(ele.id).style.border="5px solid #000";
			}else if(i==180){
				var send=function(){
					$.post("Apps/type/appsLotteryDraw/ty/updata",{
						id:ele.id.slice(1)
					},function(data){
						ele.innerHTML=ele.innerHTML+"<br>"+data+"<br>"+arr[data];
					}).error(function(){
						send();
					});
				}
				setTimeout(send,1000);
			}
		});
	}
}
</script>
<style type="text/css">
*{margin:0px;padding:0px;box-sizing: border-box;
	overflow-x: hidden;  
    overflow-y: hidden; }
.pai{
    width:92px;height:100px;
    background-color:red;
	margin:5px;	float:left; text-align:center; border-radius: 10px;
	font-weight:bold;font-size:25px;border:5px solid yellow;
	padding-top:5px;color:yellow;
	cursor:pointer;text-align:center;
	/*-webkit-transform: rotateY(180deg);*/
}
.pai:hover{
	border:5px solid #000;
}
</style>
</head>
<body>
<div id="content">
	<?php 
	foreach ($result as $row){
	?>
	<div id="d<?php echo $row['id']?>" class="pai" onclick="fan(this)">
		<?php echo $row['uname']?>
	</div>
	<?php
	}
	?>
</div>
</body>
</html>